<script>
	import { areaPower ,getArea } from "@/js_sdk/manage-area/manage.js";
	import Util from "@/js_sdk/validator/util.js"
	const global = uniCloud.importObject("global",{customUI:true})
	const db = uniCloud.database()
	let dayDate ;
	export default {
		data() {
			return {
				loading:true,
				LoadingCard:true,
				routes: [
					{to: "/pages/index/index",name: "首页",},
					{to: "",name: "账单管理" },
					{to: "",name: "配送费管理" }
				],
				priceData:0,
				shopId:'',
				// 分页
				total:0, //  总条数
				skip:0,// 开始查询位置
				limit:20, // 单词查询条数
				currentPage:1, // 当前页
				//a 日期下拉框
				selectIndex:0,
				where:{
					"shop_id.area_all.value":db.command.in( areaPower() ),
					"type":1,
					"status.value":db.command.gte(1).and(db.command.lte(6)),
					"pay_date":db.command.gt( Util.getMonthTimestamp(0).monthStart )
				},
				rangeDate:[
					{text:'本月账单',value:0},
					{text:'上月账单',value:1},
				],
				data:[],
				shopdatas:{}
			}
		},
		onLoad() {
			this.getData()
			this.getInitPrice()
		},
		methods: {
			async getData(){
				this.loading = true
				const orders =  db.collection('orders').field("shop_id,rider,address,type,pay_status,status,delivery_price,total_price,order_no,pay_date").getTemp();
				const shop =  db.collection('shop').field("_id,title,tel,area_all").getTemp({getOne: true});
				db.collection(orders,shop).where(this.where).orderBy("pay_date desc").skip(this.skip).limit(20).get({getCount:true}).then(res =>  {
					this.data = res.result.data
					this.total = res.result.count
					this.loading = false
				})
				
			},
			// 初始化 计算金额
			async getInitPrice(){
				this.LoadingCard = true;
				// 查询订单总量
				const $ = db.command.aggregate
				const dbCmd = db.command
				const Data = await db.collection('orders').aggregate()
				.lookup({
					from: 'shop',
					let: {shopId: "$shop_id" },
					pipeline: $.pipeline()
					.match(dbCmd.expr(
							$.and([  $.eq(['$_id', '$$shopId']), ])
					))
					.done(),
					as: 'shopInfo'
				}).match({
					"shopInfo.area_all.value": dbCmd.in(areaPower()),
					pay_date:this.where.pay_date,
					type:1,
					"status.value":dbCmd.gte(1).and(dbCmd.lte(6))
				})
				.group({ _id:null,price:$.sum("$delivery_price"),count:$.sum(1) }).end()
				if(Data.result.data[0]){
					this.priceData = Data.result.data[0].price
				}
				this.LoadingCard = false
			},
			// 分页
			enventFneye(val){
				this.loading = true
				this.skip = (val.current-1)*20
				this.getData()
			},
			// 下拉框
			changeDateSelect(e){
				let tempTime = Util.getMonthTimestamp(e)
				this.where.pay_date = db.command.gt(tempTime.monthStart).and(db.command.lt(tempTime.monthEnd))
				this.getData()
				this.getInitPrice()
			},
			initMobile(mobile){
				return Util.formatPhoneNumber(mobile)
			},
			onStatus(Num) {
				return Util.onStatus(Num)
			},
			goUrl(Url){
				uni.navigateTo({
					url:Url
				})
			},
			isPower(admin=['']){
				return  Util.userHasPermission(admin)
			},
		}
	}
</script>
<template>
	<view class="wdthdrawal">
		<view class="pagetitle">
			<uni-breadcrumb separator="/">
				<uni-breadcrumb-item v-for="(route,index) in routes" :key="index" :to="route.to">
					{{route.name}}
				</uni-breadcrumb-item>
			</uni-breadcrumb>
			<view class="right">
				<view class="select">
					<uni-data-select v-model="selectIndex" :localdata="rangeDate" :clear="false" @change="changeDateSelect"></uni-data-select>
				</view>
				<view v-if="isPower(['admin'])" >
					<button size="mini" type=" " @click="goUrl('./add?shop_id='+shopId)" >
						新增
					</button>
				</view>
			</view>
		</view>
		<view class="head-content" >
				<text>
						 {{selectIndex ?'上月':'本月' }}配送费:
					</text>
					<text class="fontColorApp" v-if="!LoadingCard">
						￥{{ (priceData /100).toFixed(2)   }}
					</text>
					<view v-else >
						<loadingCard scale="0.3" ></loadingCard>
					</view>
		</view>
		<view class="table">
			<uni-table ref="table" :loading="loading"  :emptyText="data.length || '没有更多数据'"  stripe type="selection" @selection-change="selectionChange">
				<uni-tr>
					<uni-th  align="center">
						用户信息
					</uni-th>
					<uni-th  align="center">
						配送费
					</uni-th>
					<uni-th  align="center">
						商户信息
					</uni-th>
					<uni-th  align="center">
						状态
					</uni-th>
					<uni-th  align="center">
						骑手信息
					</uni-th>
					<uni-th  align="center">
						订单号
					</uni-th>
					<uni-th  align="center">
						创建时间
					</uni-th>
				</uni-tr>
				
				<uni-tr v-for="(item, index) in data" :key="index" class="hoverBak" >
					<uni-td align="center">
							{{item.address.name}}
					</uni-td>
					<uni-td align="center">
						<text class="fontColorApp" style="font-weight: bold;"  >
							￥{{(item.delivery_price / 100).toFixed(2)}}
						</text>
					</uni-td>
					<uni-td align="center">
						{{item.shop_id[0].title}}
					</uni-td>
					<uni-td align="center">
						<text  :style="`color:${ onStatus(item.status.value) }`" >
							{{item.status.text}}
						</text>
					</uni-td>
					<uni-td align="center">
						<text v-if="item.rider" >
							{{item.rider.nickname}}
						</text>
					</uni-td>
					<uni-td align="center">
						<text  @click="goUrl('/pages/order/uni-pay-orders/detail?id='+item.order_no)"  style="cursor: pointer;" >
							{{item.order_no}}
						</text>
					</uni-td>
					<uni-td align="center">
						<uni-dateformat :date="item.pay_date" ></uni-dateformat>
					</uni-td>
					
				</uni-tr>
			</uni-table>
			
		</view>
		<view class="uni-pagination-box">
			<uni-pagination @change="enventFneye" :v-model="currentPage" :pageSize="limit" title="" :total="total"></uni-pagination>
		</view>
		
	</view>
</template>


<style lang="scss" scoped>
	.head-content{
		color:#777;
		height:30px;
		display: flex;
		align-items: center;
		padding:10px 20px;
	}
	.select{
		width:500rpx;
		margin:0 20rpx;
	}
	.pagetitle{
		padding:10rpx;
		display: flex; justify-content: space-between; align-items:center;
		.right{
			display:flex;
		}
	}
	.warn{
		padding:10rpx;
	}
	.item{
		padding:10rpx;
		margin:0rpx;
		border-bottom:1rpx solid #eee;
		display: flex; justify-content: space-between; align-items:center;
		.items{
			flex: 1;
			text-align: center;
		}
	}
	.title{
		font-size:16px;font-weight: bold;
	}
	.table{
		margin:50rpx 20rpx;
		border:1px solid #eee;
		border-bottom:none
	}
	.wdthdrawal{
		padding:20rpx;
		font-size:14px;
	}
</style>
